import 'package:cbec_app/components/base/base_interactive.dart';
import 'package:cbec_app/components/common/common_style.dart';
import 'package:cbec_app/utils/ThemeConfig.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

///拼团标签
class TeamWorkTagItem extends StatefulWidget {
  ///标签列表
  final List tagList;

  ///标签默认装饰
  final BoxDecoration decoration;

  ///激活时的装饰
  final BoxDecoration? activeDecoration;

  ///文本大小
  final double fontSize;

  ///文本颜色
  final Color color;

  ///文本激活颜色
  final Color activeColor;
  ///激活的索引
  final int curIndex;

  ///点击回调
  final Function(int index)? onClick;



  const TeamWorkTagItem({
    super.key,
    required this.tagList,
    this.decoration = const BoxDecoration(
        border: Border(), borderRadius: BorderRadius.all(Radius.circular(25))),
    this.activeDecoration,
    this.fontSize = 13,
    this.color = ThemeConfig.mainTextColor,
    this.activeColor = ThemeConfig.mainTextColor,
    this.curIndex=0,
    this.onClick
  });

  @override
  State<StatefulWidget> createState() {
    return _TeamWorkTagItemState();
  }
}

class _TeamWorkTagItemState extends State<TeamWorkTagItem> {
  ///当前选中的索引
  int _curIndex = 0;

  @override
  void initState() {
    super.initState();
    _curIndex=widget.curIndex;
  }


  
  @override
  Widget build(BuildContext context) {
    return Wrap(
        runSpacing: 19,
        spacing: 19,
        children: List.generate(
            widget.tagList.length,
            (index) => BaseInteractive(
                childWidget: Container(
                  padding: EdgeInsets.only(
                      left: 10.w, right: 10.w, top: 5.h, bottom: 5.h),
                  decoration: index == _curIndex
                      ? widget.activeDecoration
                      : widget.decoration,
                  child: Text(
                    '${widget.tagList[index]['peopleNumber']}人团',
                    style: setTextStyle(
                        widget.fontSize, FontWeight.w300, widget.color),
                  ),
                ),
                onClick: () {
                  setState(() {
                    _curIndex=index;
                  });
                  if(widget.onClick!=null){
                    widget.onClick!(index);
                  }
                })));
  }
}
